'use client' import { useState, useEffect } from 'react' import { Card, CardContent } from "@/components/ui/card" import { Slider } from "@/components/ui/slider" import { Button } from "@/components/ui/button" import { Input } from "@/components/ui/input" export default function RevenueCalculator() { const [conversionRate, setConversionRate] = useState(0.06) const [averageOrderValue, setAverageOrderValue] = useState(10) const [monthlySessions, setMonthlySessions] = useState(50000) const [abTestImpact, setAbTestImpact] = useState(5) const [extraRevenue, setExtraRevenue] = useState(0) useEffect(() => { const baseRevenue = conversionRate / 100 * averageOrderValue * monthlySessions const improvedRevenue = (conversionRate * (1 + abTestImpact / 100)) / 100 * averageOrderValue * monthlySessions setExtraRevenue(Math.round(improvedRevenue - baseRevenue)) }, [conversionRate, averageOrderValue, monthlySessions, abTestImpact]) return (

Input your store's stats below and find out exactly how much extra revenue a single test will generate.

Conversion Rate

setConversionRate(value)} className="flex-1" /> setConversionRate(Number(e.target.value))} className="w-20" /> %

Average Order Value

setAverageOrderValue(value)} className="flex-1" /> setAverageOrderValue(Number(e.target.value))} className="w-20" /> £

Monthly Sessions

setMonthlySessions(value)} className="flex-1" /> setMonthlySessions(Number(e.target.value))} className="w-28" />

A/B Test Impact

{[2.5, 5, 10].map((impact) => ( ))}

You're missing out on...

£{extraRevenue}

extra monthly revenue

) }